<!DOCTYPE html>
<html lang="en" >
<head>
	<meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta name="apple-mobile-web-app-status-bar-style" content="blank">
    <meta content="telephone=no" name="format-detection" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>添加地址</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/common.css" />
    <link rel="stylesheet" href="./css/addAddress.css">
    <link rel="stylesheet" href="./css/swiper-3.4.2.min.css">
    <script src="js/jquery-1.11.3.min.js"></script>
    <script src="js/flexible_css.js"></script>
    <script src="js/flexible.js"></script>

    <script type="text/javascript" src="js/city.js"></script>
    <style>
        select {
      /*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/
      /* border: solid 1px #000; */
    /* width: 200px; */
      /*很关键：将默认的select选择框样式清除*/
      appearance:none;
      -moz-appearance:none;
      -webkit-appearance:none;
    
      /*在选择框的最右侧中间显示小箭头图片*/
        background: url(images/drop@2x.png) no-repeat right center ;
    
      /*为下拉小箭头留出一点位置，避免被文字覆盖*/
        padding-right: 14px;
        display: block;
    }
    
    /*清除ie的默认选择框样式清除，隐藏下拉箭头*/
    select::-ms-expand { display: none; }
    </style>

</head>
<body ontouchstart  onload="setup();preselect('河南省');">

    <div class="wrap">
        <!-- <div class="head">添加地址</div> -->
        <!-- 当地址列表为空的时候显示 -->
        <div class="hide">
            <div class="kongImg">

                <img src="./images/empty@2x.png" alt="不好意思图图裂了">
                <div>找不到你哦，快来添加一个吧</div>
            </div>
            <div class="toNewBtn">
                +
                <span>添加新地址</span>        
            </div>
        </div>
        <!-- 添加详细地址的页面 form 表单-->
        <form action="">
            <div class="addressContent">
            <section>
                <span>收货人姓名:</span> <input type="text" placeholder="请输入收货人的姓名">
            </section>
            <section>
                    <span>收货人电话:</span> <input type="number" placeholder="请输入收货人的手机号或电话号">
            </section>

                <div class="three">   
                <span>所在地区:</span>
                    <div class="three-content">
                            <select class="select" name="province" id="s1">
                                    <option></option>
                            </select>
                            <select class="select" name="city" id="s2">
                                    <option></option>
                            </select>
                            <select class="select" name="town" id="s3">
                                    <option></option>
                            </select>
                    </div>
                </div>
            
                <section>
                        <span>详细地址:</span> <input type="text" id="address" placeholder="请输入详细收货地址">
                </section>
            </div>
            <button id="submit">添加地址</button>
        </form>
    </div>


    <script>
            function promptinfo()
            {
                var address = document.getElementById('address');
                var s1 = document.getElementById('s1');
                var s2 = document.getElementById('s2');
                var s3 = document.getElementById('s3');
                var vvv = address.value = s1.value + s2.value + s3.value; 
                $('#address').html(vvv)  
            }
            
    </script>
            
    <script src="js/swiper-3.4.2.min.js"></script>
    
    <script>
  </script>
</body>
</html>
